<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./CSS/common.css">
    <link rel="stylesheet" href="./CSS/index.css">
</head>
<body>
    <!-- 头部导航 -->
    <div class="header">
        <div class="wrapper">
            <div class="title">
                <a href="">华为官网  |</a>
                <a href="">荣耀官网  |</a>
                <a href="">软件应用  |</a>
                <a href="">花粉俱乐部  |</a>
                <a href="">Select Region  |</a>
            </div>
            <div class="title">
                <a href="" style="font-weight: bold; flood-color: black;">登录   </a>
                <a href="" style="font-weight: bold; flood-color: black;">注册   |</a>
                <a href="">我的订单  |</a>
                <a href="">V码(优购码)  |</a>
                <a href="">手机版 |</a>
                <a href="">网站导航 |</a>
            </div>
        </div>
    </div>
    <!-- 华为专区 -->
     <div class="header_title wrapper">
        <div class="start">
            <a href="#"></a>
            <div>
                <span>商城首页</span>
            </div>
            
        </div>
        <ul>
            <li><img src="./images/qrcode_vmall_app01.png" alt=""></li>
            <li>微信扫码关注我们</li>
        </ul>
     </div>
    <!-- 轮播图区域 -->
     <div class="swiper">
        <div class="top_nav">
            <div class="wrapper">
                <ul>
                    <li><a href="#">华为专区</a></li>
                    <li><a href="#">HUAWEI P10</a></li>
                    <li><a href="#">HUAWEI Mate9</a></li>
                    <li><a href="#">HUAWEI Nova</a></li>
                    <li><a href="#">华为畅销6S</a></li>
                    <li><a href="#">荣耀专区</a></li>
                </ul>
            </div>
            
        </div>
        <div class="bar wrapper">  
            <!-- 导航栏区域 -->
            <ul>
                <li> 全部商品</li>
                <li>
                    <p>手机</p>
                    <a href="#">HUAWEI Mate系列</a>
                </li>
                <li>
                    <p>平板 & 穿戴</p>
                    <a href="#">平板电脑 手环/手表</a>
                </li>
                <li>
                    <p>笔记本电脑</p>
                </li>
                <li>
                    <p>智能家居</p>
                    <a href="#">子母路由 电力猫 路由器</a>
                </li>
                <li>
                    <p>专属配件</p>
                    <a href="#">贴膜 保护壳 保护套</a>
                </li>
                <li>
                    <p>通用配件</p>
                    <a href="#">耳机 音箱</a>
                </li>
            </ul>  
            <ol>
                <li><span>1</span></li>
                <li><span>2</span></li>
                <li><span>3</span></li>
                <li><span>4</span></li>
                <li><span>5</span></li>
                <li><span>6</span></li>
                <li><span>7</span></li>
            </ol>
        </div>

     </div>
     <!-- 手机推荐区 -->
      <div class="recom wrapper">
        <img src="./images/20170310090516264.jpg" alt="">
        <img src="./images/20170310105644358.jpg" alt="">
        <img src="./images/2017031017165551.jpg" alt="">
        <img src="./images/20170313143419135.jpg" alt="">
        <div class="phone02" >
            <div class="phone_text">
                <p class="phone_text1">HUAWEI P10 Plus</p>
                <p class="phone_text2">金属钻雕工艺</p>
                <p class="phone_text3">￥4388</p>
            </div>
            <img  style="width: 198px;" src="./images/1484219138436.png" alt="">
        </div>
        <div class="phone02">
            <div class="phone_text">
                <p class="phone_text1">HUAWEI nova 青春版</p>
                <p class="phone_text2">炫出我色彩</p>
                <p class="phone_text3">￥1999</p>
            </div>
                
            <img style="width: 198px;" src="./images/1489161234073.png" alt="">
        </div>
        <div class="phone02">
            <div class="phone_text">
                <p class="phone_text1">HUAWEI nova 青春版</p>
                <p class="phone_text2">2k双曲面屏</p>
                <p class="phone_text3">￥4699</p>
            </div>
               
            <img style="width: 198px;" src="./images/1491476650727.png" alt="">
        </div>
      </div>

      <!-- 底部 -->
<div class="footer">
    <div class="wrapper">
      <!-- 服务 -->
      <div class="service">
        <ul>
            <li>
              <h5></h5>
          
              <p>500强企业 品质保证</p>
          
            </li>
          
            <li>
              <h5></h5>
          
              <p>7天退货 15天换货</p>
          
            </li>
          
            <li>
              <h5></h5>
          
              <p>99元起免运费</p>
          
            </li>
          
            <li>
              <h5></h5>
          
              <p>448家维修网点 全国联保</p>
          
            </li>
          
          </ul>
          
      </div>
  
      <!-- 帮助中心 -->
      <div class="help"><div class="left">
        <dl>
          <dt>帮助中心</dt>
          <dd><a href="#">购物指南</a></dd>
          <dd><a href="#">配送方式</a></dd>
          <dd><a href="#">支付方式</a></dd>
          <dd><a href="#">常见问题</a></dd>
        </dl>
      
        <dl>
          <dt>售后服务</dt>
      
          <dd><a href="#">保修政策</a></dd>
      
          <dd><a href="#">退换服务政策</a></dd>
      
          <dd><a href="#">退换货流程</a></dd>
          <dd><a href="#">保修状态查询</a></dd>

      
        </dl>
      
        <dl>
          <dt>技术支持</dt>
      
          <dd><a href="#">售后网点</a></dd>
      
          <dd><a href="#">荣耀零售店铺</a></dd>
      
          <dd><a href="#">预约维修</a></dd>
          <dd><a href="#">手机寄修服务</a></dd>
          <dd><a href="#">维修配件价格查询</a></dd>
          <dd><a href="#">软件下载</a></dd>

      
        </dl>
      
        <dl>
          <dt>关于商城</dt>
      
          <dd><a href="#">公司介绍</a></dd>
      
          <dd><a href="#">华为商城简介</a></dd>
      
          <dd><a href="#">联系客服</a></dd>
      
        </dl>
      
        <dl>
          <dt>关注我们</dt>
      
          <dd><a href="#">新浪微博<span class="iconfont icon-customer-service"></span></a></dd>
      
          <dd><a href="#">腾讯微博</a></dd>
      
          <dd><a href="#">花粉俱乐部</a></dd>
          <dd><a href="#">商城手机版</a></dd>
      
        </dl>
      
      </div></div>
  
      <!-- 版权 -->
      <div class="copyright">
        <div class="footer02" >
            <div class="wrapper">
                <a href="#">友情链接： |</a>
            <a href="#">华为官网 |</a>
            <a href="#">华为消费者业务 |</a>
            <a href="#">荣耀官网 |</a>
            <a href="#">花粉俱乐部 |</a>
            <a href="#">莫塞尔商城 |</a>
            <a href="#">爱旅官网 |</a>
            <a href="#">华为应用市场 |</a>
            <a href="#">万表网 |</a>
            <a href="#">中商情报网 |</a>
            <a href="#">刷机精灵 |</a>
            <a href="#">华为手机 |</a>
            <a href="#">优购物官网 |</a>
            <a href="#">智能电视 |</a>
            <a href="#">UC浏览器 |</a>
            <a href="#">中关村商城 |</a>
            <a href="#">酷狗音乐 |</a>
            <a href="#">华为商城手机版 |</a>
            <a href="#">百信手机网 |</a>
            <a href="#">卡宝宝网 |</a>
            <a href="#">多特软件下载 |</a>
            <a href="#">同步助手 |</a>
            <a href="#">蜂鸟摄影网 |</a>
            <a href="#">奇珀论坛 |</a>
            <a href="#">家具商城 |</a>
            <a href="#">拍鞋网商城 |</a>
            <a href="#">欧宝丽珠宝 |</a>
            <a href="#">寻购网 |</a>
            <a href="#">亿智蘑菇 |</a>
            <a href="#">安卓市场 |</a>
            <a href="#">阿里巴巴生意经 |</a>
            <a href="#">手机大全 |</a>
            <a href="#">安卓软件园 |</a>
            <a href="#">卓大师刷机 |</a>
            <a href="#">智机论坛 |</a>
            <a href="#">电子产品世界 |</a>
            <a href="#">历趣网 |</a>
            <a href="#">网购返利 |</a>
            <a href="#">Apple110 |</a>
            <a href="#">91手机门户网 |</a>
            <a href="#">移动叔叔 |</a>
            <a href="#">奥特莱斯 |</a>
            <a href="#">荣耀Magic |</a>
            <a href="#">携程租车 |</a>
            <a href="#" style="color: red;">申请链接 >> </a>
            <br>
            隐私政策 服务协议 Copyright ? 2012-2017 VMALL.COM 版权所有 保留一切权利
             <br>
             <div class="End_title">
                <img src="./images/20160226162651249.png" alt="">
                公安备案 苏公网安备 32011402010009号 | 苏ICP备09062682号-9 | 增值电信业务经营许可证：苏B2-20130048 | 网络文化经营许可证：苏网文[2015] 1599-026号
             </div>
             <div class="End_img">
                <img src="./images/20160226162415360.png" alt="">
                <img src="./images/20160226162521265.png" alt="">
                <img src="./images/20160226162531395.png" alt="">
             </div>
            </div>
      </div>
  
    </div>
  
  </div>
</body>
</html>